<!--{template common/container/pc/header_start}-->
<link rel="stylesheet" href="static/scss/default/index.css?{VERHASH}">
<link rel="stylesheet" href="{MOD_PATH}/assets/css/setting.css?{VERHASH}">
<script type="text/javascript" src="static/js/sortable.min.js?{VERHASH}"></script>
<!--{template common/container/pc/header_end}-->
<div id="dzzoffice">
	<el-container class="page-main">
		<el-header style="padding: 0;">
			<!--{template components/setting/header}-->
		</el-header>
		<el-container>
		  	<el-aside width="200px" class="page-left">
				<!--{template components/setting/left}-->
			</el-aside>
			<el-main>
				<el-scrollbar>
					<div v-show="leftactive == 'secretkey'">
						<!--{template components/setting/secretkey}-->
					</div>
					<div  v-show="leftactive != 'secretkey'">
						<!--{template components/setting/tag}-->
					</div>
				</el-scrollbar>
			</el-main>
		</el-container>
	</el-container>
</div>
<script type="text/javascript">
	const { createApp, reactive, toRefs, toRef, ref, onMounted, nextTick, watch } = Vue;
	const dzzoffice = createApp({
		data() {
			return {
				leftactive:'secretkey',
				DocumentThemeColor:'',
				btnloading:false,
			}
		},
		watch:{
			DocumentThemeColor:{
				handler(newval){
					document.querySelector('html').className = newval
				},
				deep:true,
				// immediate:true
			}
		},
		mixins:[secretkeyMixin,PromptOtherMixin],
		created() {
			 //主题颜色
			 let theme = localStorage.getItem('theme');
			if(theme){
				this.DocumentThemeColor=theme;
			}else{
				this.DocumentThemeColor = 'light'
			}
			
		},
		methods: {
			LeftSelect(value){
				if(this.leftactive == value)return false;
				this.leftactive = value;
				if(value != 'secretkey'){
					this.PromptGet();
					this.PromptSortable();
				}
			},
			DocumentThemeChange(){
				if(this.DocumentThemeColor=='light'){
					this.DocumentThemeColor='dark';
					localStorage.setItem('theme','dark');
				}else{
					this.DocumentThemeColor='light';
					localStorage.setItem('theme','light');
				}
				
			},
		},
		mounted() {}
	});
	dzzoffice.use(ElementPlus, {
		locale: ElementPlusLocaleZhCn,
	});
	for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
		dzzoffice.component(key, component)
	}
	dzzoffice.component('comavatar', comavatar)
	// 屏蔽警告信息
	dzzoffice.config.warnHandler = function(){return null};
	dzzoffice.mount('#dzzoffice');
</script>

<!--{template pc/frame/footer_simple}-->
